<template>
	<view class="page">
		<view class="el-flex">
			<view class="title">售后服务</view>
			<view class="icon-flex">
				<view class="icon-flex-item" @click="cjwt">
					<view class="item-img"><image src="./../../static/img/29.png" alt=""></view>
					<view class="item-name">常见问题</view>
				</view>
				
				<view class="icon-flex-item"  @click="showPasswordPanel = true">
					<view class="item-img"><image src="./../../static/img/22.png" alt=""></view>
					<view class="item-name">余额密码</view>
				</view>
				<view class="icon-flex-item" @click="goXieyi()">
					<view class="item-img"><image src="./../../static/img/36.png" alt=""></view>
					<view class="item-name">用户协议</view>
				</view>
				<view class="icon-flex-item" @click="goYingsi()">
					<view class="item-img"><image src="./../../static/img/34_1.png" alt=""></view>
					<view class="item-name">隐私政策</view>
				</view>
			</view>
		</view>
		<view class="el-flex">
			<view class="title">查询办理</view>
			<view class="icon-flex">
			   <view class="icon-flex-item" @click="toApplyTui">
					<view class="item-img"><image src="./../../static/img/33.png" alt=""></view>
					<view class="item-name">我的余额</view>
				</view>


				<view class="icon-flex-item" @click="gotoView">
					<view class="item-img"><image src="./../../static/img/30.png" alt=""></view>
					<view class="item-name">智能检测</view>
				</view>

				 <view class="icon-flex-item" @click="toLog">
					<view class="item-img"><image src="./../../static/img/35.png" alt=""></view>
					<view class="item-name">充值记录</view>
				</view>
				
				<view class="icon-flex-item" @click="realNameRegister">
					<view class="item-img"><image src="./../../static/img/37.png" alt=""></view>
					<view class="item-name">实名认证</view>
				</view>
				
			</view>
		</view>
		<setPassWord :uShow="showPasswordPanel"  @hide="hide"/>
	</view>
</template>

<script>
	import setPassWord from '@/components/setPassWord.vue'
	export default {
		components:{
			setPassWord
		},
		data(){
			return{
				showPasswordPanel:false
			}
		},
		methods:{
			hide(){
				this.showPasswordPanel = false
			},
			toApplyTui(){
				uni.navigateTo({
					url:'/pages/yue/index'
				})
			},
			detailsTo(){
				uni.navigateTo({
					url:'/pages/coupon/huodongIndex'
				})
			},
			gotoView(){
				uni.navigateTo({
					url:'/pages/zhenduan/index'
				})
			},
			toBuyPrice(){
				
			},
			goXieyi(){
				uni.navigateTo({
					url:'/pages/user/xieyi'
				})
			},
			goYingsi(){
				uni.navigateTo({
					url:'/pages/user/yingsi'
				})
			},
			toLog(){
				uni.navigateTo({
					url:'/pages/rechargeRecord/index'
				})
			},
			cjwt(){
				let url='http://webchat.szxxtx.com/#/newUser/problem';
				//#ifdef H5
				window.location.href = url;
				//#endif
				uni.navigateTo({
					url:"/pages/index/webview?url=" + url
				})
			},
			toApplyShop(){
				
			},
			realNameRegister(){
				this.$api.authUrl({iccid:uni.getStorageSync('iccid') || '',supplierCode:this.simInfo.supplierCode || ''}).then(res=>{
					// code=409 表示是联调，需要跳转联通小程序实名。
					// code=408 表示是电信，直接跳转 data里面的链接
					// code=407 表示是移动,直接跳转data里面链接。
					if(res.code === '407' || res.code === '408' ){
						//#ifdef H5
						window.location.href = res.data
						//#endif
						//#ifdef APP-PLUS
						plus.runtime.openURL(res.data)
						//#endif
					}else if(res.code === '409'){
						
					}else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						})
					}
				})
			},
			kfClick(){
				this.$api.kefuUrl({iccid:uni.getStorageSync('iccid') || ''}).then(res=>{
					let urls=res.data;
					console.log("当前客服链接为"+urls);
					//#ifdef H5
					window.location.href = urls
					//#endif
					//#ifdef APP-PLUS
						uni.navigateTo({
							url:"/pages/index/webview?url=" + urls
						})
					//#endif
					
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	view{
	    display: flex;
	    flex-grow: 0;
	    flex-basis: auto;
	    align-items: stretch;
	    flex-direction: column;
	}
	.page{
		height:100vh;
		background: #f7f8fa;
	    .el-flex{
	        background-color: #fff;
	        align-self: center;
	        margin-top: 20px;
	        border-radius: 20px;
	        padding: 12px 0;
	        width:90%;
	        .title{
	            font-size: 15px;
	            font-weight: 700;
	            color: #06121e;
	            margin-left: 15px;
	            margin-bottom: 7px;
	        }
	        .icon-flex{
	            flex-wrap: wrap;
	            flex-direction: row;
	            .icon-flex-item{
	                width: 25%;
	                margin: 10px 0px 10px;
	                align-items: center;
	                flex-direction: column;
	                .item-img{
	                    width: 48px;
	                    height: 48px;
						image{
							width: 48px;
							height: 48px;
						}
	                }
	                .item-name{
	                    font-size: 12px;
	                    font-weight: 700;
	                    color: #3d444d;
	                    margin-top: 5px;
	                }
	            }
	        }
	    }
	}
</style>